﻿@using System.Text.RegularExpressions; 
@using ContentSlider.Models;
@{
    Script.Require("jQuery");
    Style.Require("ContentSliderStyles");
    Script.Require("jQueryAwkwardShowcase");
    string groupName = Regex.Replace(Model.Group.Name, @"[^a-zA-Z0-9_-]", "-").ToLower(); 
}

@if (Model.FeaturedItems.Count > 0) {
    int i = 0;
    <div class="showcase-group-wrapper" style="width:@(Model.Group.GroupWidth)px;">
        <div id="@groupName" class="showcase">
            @foreach (FeaturedItemViewModel featuredItem in Model.FeaturedItems) {
                <div class="showcase-slide" @Html.Raw(i==0? "" : @"style=""display:none"";")>
                    <div class="showcase-content">
                        @* <!-- 
                            If the slide contains multiple elements you should wrap them in a div with the class .showcase-content-wrapper. 
                            We usually wrap even if there is only one element, because it looks better. 
                        --> *@
                        <div class="showcase-content-wrapper">
                            @if (!string.IsNullOrWhiteSpace(featuredItem.ContentHtml)) {
                                @Html.Raw(featuredItem.ContentHtml)
                            }
                        </div>
                    </div>
                </div>
                i++;
            }
        </div>
    </div>
}   

@using (Script.Foot()) {
    if (Model.FeaturedItems.Count > 1) {
<script type="text/javascript">// <![CDATA[
$(document).ready(function () {
    $('#@groupName').awShowcase({
            content_width: @Model.Group.GroupWidth,
            content_height: @Model.Group.GroupHeight,
            auto: true,
            interval: @Model.Group.SlidePause,
            loading: true,
            arrows: false,
            buttons: true,
            transition: '@Html.Raw(Ajax.JavaScriptStringEncode(Model.Group.TransitionEffect))',
            transition_delay: 0,
            transition_speed: @Model.Group.SlideSpeed, 
            continuous: true
    });
});
// ]]></script>
    }
}